<template >
  <!-- tabbar底部导航 -->
  <van-tabbar v-model="active">
    <van-tabbar-item 
    :icon="item.meta.icon"
    v-for="(item,index) in router.options.routes[0].children"
    :key="item.path"
    :url="'#/'+item.path">
      {{ item.meta.name }}
    </van-tabbar-item>
  </van-tabbar>
  <router-view />
</template>
<script setup>
import { onMounted, ref } from 'vue';
import {useRoute,useRouter} from 'vue-router'

const route=useRoute()
const router=useRouter()

const active = ref(0);
onMounted(()=>{
  // console.log(router.options.routes[0].children)
  const homeChildren=router.options.routes[0].children
  active.value=homeChildren.findIndex(element=>'/'+element.path===route.path)
})
</script>
<style lang="less" scoped>
  
</style>